<th:block th:fragment="form">
    <script>
        function administratorsFormEl(){
            let { ref, reactive } = Vue;
            const FI = baseForm.item;
            const defaultV = () => {
                return {
                    "id":null,
                    "name":"",
                    "account":"",
                    "password":"",
                    "error_number":0,
                    "lately_time":null,
                    "error_date":null,
                    "status":1,
                    "role_ids":"",
                    "create_id":0
                }
            };
            const administrators = reactive(defaultV());
            let administratorsRef;
            const enumOptions = {};
            enumOptions.status = ref([]);

            function optionsAssign(name, data){
                enumOptions[name] = data;
            }
            const administratorsRule = ref({});

            const el = baseForm.form()
                .model("administrators")
                .ref('administratorsRef')
                .rules("administratorsRule")
                .addItems(
                    FI.input('id',''),
                    FI.input('name','用户名'),
                    FI.input('account','账号'),
                    FI.input('password','密码'),
                    FI.input('error_number','密码错误次数'),
                    FI.input('lately_time','最近登录'),
                    FI.input('error_date','错误日期'),
                    FI.radio('status','状态').options('status'),
                    FI.input('role_ids','角色'),
                    FI.input('create_id','创建人'),

                )
                .getEl(function (formEl, rules) {
                    formEl.style.maxWidth = '1000px';
                    administratorsRule.value = rules;
                });

            function submit(){
                administratorsRef.validate((valid) => {
                    if (!valid) {
                        return;
                    }
                    sc.axios.post('/admin-test/administrators/create', administrators).then((res) => {
                        if (res.code === 200) {
                            parent.sc.message.success("操作成功");
                            sc.closeCurrentPage();
                        } else {
                            sc.message.error(res.message);
                        }
                    });
                });
            }

            function appInit(elId){
                app.create("#" + elId, {
                    mounted(){
                        administratorsRef = this.$refs.administratorsRef;
                    },
                    setup() {
                        return {
                            administrators,
                            status: enumOptions.status,

                            administratorsRule,
                            submit
                        }
                    }
                })
            }

            function initData(data = null){
                if (data === null){
                    this.initData(defaultV());
                    return;
                }
                if (typeof data === 'object'){
                    sc.copyObjValue(data, administrators);
                    return;
                }
                sc.axios.get('/admin-test/administrators/get-info', {id: data}).then((res) => {
                    initData(res.data);
                });
            }


            return {
                formEl: (() => {
                    const formEl = document.createElement('el-config-provider');
                    formEl.appendChild(el);
                    formEl.setAttribute(':z-index', 22222222)
                    return formEl;
                })(),
                appInit,
                initData,
                optionsAssign,
            }
        }
    </script>
</th:block>
